<template>
	<app-layout>
		<view v-if="!goods" class="u-goods-detail"></view>
		<template v-if="goods">
			<!-- 11.10 珠宝店主 上下切换 -->
			<view class="rota">
				<swiper style="height: 50rpx;" :autoplay="true" :interval="3000" :duration="1000" :circular="true"
					:vertical="true">
					<swiper-item v-for="(item,index) in avaterimg" :key="index">
						<view class="swiper-item cross-center">
							<image class="imgag" :src="item.useravatar" mode=""></image>
							{{item.username}}
						</view>
					</swiper-item>
				</swiper>
			</view>
			<view class="rota" style="z-index: 100;background: none;"></view>
			<!-- logo水印 -->
			<view class="rotalogo">
				<image class="image" :src="imgprefix+'/web/uploads/logo/logo.png?timeout='+timeout" mode="widthFix">
				</image>
			</view>
			<!-- 11.10 介绍视频弹窗 -->
			<movable-area class="movable">
				<movable-view @click="leabrand" class="movable-item" direction="all" x="0" y="100" :inertia="true">
					介绍视频
				</movable-view>
			</movable-area>
			<!--商品轮播图 9.28 有修改 10.27 添加录播v-bind:video-pageurl="goods.video_pageurl" -->
			<app-goods-banner v-bind:pic-list="goods.pic_url" v-bind:share="goods.share" v-bind:ishj="ishj"
				v-bind:watchnum="goods.shownums" v-bind:video-url="goods.video_url" v-bind:goods_id="goods.id"
				v-bind:mall_id="mall_id" v-bind:video-pageurl="goods.video_pageurl"
				v-bind:goods_gold="goods.original_price_discount" v-bind:goods="goods">
			</app-goods-banner>
			<!-- 2021.12.7  -->
			<view class="goods-explain" :class="getTheme + '-m-back ' + getTheme" v-if="goods.gt_miaoshu">
				{{goods.gt_miaoshu}}
			</view>
			<!--商品标题-->
			<view class="goods-name">
				<text class="goodcatname">{{catsall.name}}</text>{{goods.name}}
			</view>
			<!-- <view class="goods-subtitle">
				<view class="t-omit-three">去实体店体验</view>
				<view class="t-omit-three">{{goods.subtitle}}</view>
			</view> -->
			<!--商品价格 11.29 将store换为userInfo.vdian_id -->
			<view class="price">
				<app-goods-price @quickShare="quickShare" v-bind:discount='discount'
					v-bind:is_vip_card_user="is_vip_card_user" v-bind:goods="goods" v-bind:select-attr="selectAttr"
					v-bind:theme="getTheme" v-bind:has-poster-nav="true" v-bind:ishj="ishj" v-bind:mall_id="mall_id"
					v-bind:poster-config="poster_config + `&goods_id=` + goods.id + `&v_id=` + userInfo.vdian_id"
					v-bind:poster-generate="poster_generate + `&goods_id=` + goods.id + `&v_id=` + userInfo.vdian_id">
				</app-goods-price><!-- v-bind:sharecon="goods.params" -->
			</view>
			<!--商品超级会员卡-->
			<!-- <view class="vip-card" v-if="is_vip">
				<app-vip-card background="#fff" top="0"></app-vip-card>
			</view> -->
			<!--限时抢购入口-->
			<!-- <app-goods-flash-sale v-if="flash_sale" :theme="getTheme" :flash_sale="flash_sale"></app-goods-flash-sale> -->
			<!-- 查询钻石 -->
			<view class="goods-margin" v-if="mall_id == 2">
				<image class="zsjt" :src="imgprefix + '/web/uploads/logo/ring2.png?timeout='+timeout" mode="widthFix">
				</image>
			</view>
			<!-- 戒托 查询裸钻 -->
			<view class="goods-margin" @click="searchbr" v-if="mall_id == 2">
				<image class="zsjt" :src="imgprefix + '/web/uploads/logo/baredrill.png?timeout='+timeout"
					mode="widthFix">
				</image>
			</view>
			<!-- 裸钻定制 查询戒托 -->
			<view class="goods-margin" @click="searchjt" v-if="mall_id == 2 && cat_id == 1325">
				<image class="zsjt" :src="imgprefix + '/web/uploads/logo/ringjt.png?timeout='+timeout" mode="widthFix">
				</image>
			</view>
			<!--商品服务-->
			<view class="goods-margin" v-if="services">
				<app-goods-service :guarantee_title="goods.guarantee_title" :guarantee_pic="goods.guarantee_pic"
					:theme="getTheme" :list="services"></app-goods-service>
			</view>
			<!-- 如何获取优惠券 -->
			<!-- <view class="goods-margin" @click="voucher" v-if="goods.goods_coupon_center.length > 0">
				<view class="u-service cross-center">
					<view class="box-grow-0 u-text">如何获取优惠券</view>
					<image class="u-icon-del" src="../../static/image/icon/arrow-right.png"></image>
				</view>
			</view> -->
			<!-- 9.30 添加金币白条 11.12 黄金商品不使用金币白条 -->
			<view class="goods-margin" @click="tobaitiao" v-if="!ishj && mall_id == 1">
				<view class="u-service u-orange cross-center">
					<view class="box-grow-0">
						<!-- 查看自己得金币并可使用 -->
						金币<!-- 白条 -->可以省好多钱
					</view>
					<view class="canmore">
						<text class="bigzi">
							金币<!-- 白条 -->
						</text>
						<text class="smalzi">
							点击进入>>>
						</text>
					</view>
				</view>
			</view>
			<view class="goods-margin" @click="leabrand">
				<view class="u-service u-red cross-center">
					<view class="box-grow-0">线上线下完美合一的珠宝领导品牌</view>
					<view class="canmore">
						<text>查看更多</text>
						<image class="image" src="../../static/image/icon/right.png"></image>
					</view>
				</view>
			</view>
			<!-- 评价 -->
			<view class="goods-margin" v-if="comment_list.length > 0">
				<app-goods-comment :comment_list="comment_list" :theme="getTheme"></app-goods-comment>
			</view>

			<!-- 商品规格 -->
			<!-- 加isshoe判断 jia issjo -->
			<!-- 9.30 :isshoe="isshoe" ref="issjo" 11.12 禁止使用购物车 是否分享成功 是否是黄金 -->
			<u-attr :store_id="store_id" v-if="goods.is_negotiable === 0" v-model="attrShow" :goods="goods"
				:is_show_left="mall_id == 2 ? true : false" :themeObject="themeObject" :checked="checked"
				:is_must_left="false" @check="check" rightText="定金支付" ref="issjo" :issharesuc="issharesuc" :ishj="ishj">
				<view class="goods-margin" slot="btn" v-if="goods.type === 'goods' && goods.pintuanGoods.isabbuy == 1">
					<app-goods-attr :attr-groups="goods.attr_groups" :selectAttr="checked" :attr="goods.attr">
					</app-goods-attr>
				</view>
			</u-attr>
			<!--商品优惠券-->
			<view class="goods-margin">
				<app-goods-coupon @change="setCoupon" :theme="getTheme" :coupons="goods.goods_coupon_center">
				</app-goods-coupon>
			</view>
			<!-- 获取金币规则 -->
			<view class="goods-margin" @click="integral"
				v-if="goods_marketing_award.integral && goods_marketing_award.integral.title">
				<view class="u-service cross-center">
					<view class="box-grow-0 u-text">获取金币规则</view>
					<image class="u-icon-del" src="../../static/image/icon/arrow-right.png"></image>
				</view>
			</view>
			<!--商品信息-->
			<view class="goods-margin">
				<app-goods-marketing :limit="goods_marketing.limit" :express="express"
					:shipping="goods_marketing.shipping" :pickup="goods_marketing.pickup"
					:balance="goods_marketing_award.balance" :coupon="goods_marketing_award.coupon"
					:card="goods_marketing_award.card" :theme="getTheme" :integral="goods_marketing_award.integral">
				</app-goods-marketing>
			</view>
			<!--套餐组合-->
			<!-- <view @click="toComposition" class="goods-composition goods-margin"
				v-if="composition && composition.list.length > 0">
				<view class="goods-composition-title">套餐组合</view>
				<uni-swiper-dot :current="current" :theme="getTheme" :info="composition.list" mode="customize">
					<swiper @change="change" class="goods-composition-swiper" :current="current" :autoplay="true">
						<swiper-item v-for="item in composition.list" :key="item.id">
							<app-composition :theme="getTheme" @click="toComposition(item)" @look="toComposition(item)"
								:item="item"></app-composition>
						</swiper-item>
					</swiper>
				</uni-swiper-dot>
				<view class="goods-composition-more main-between cross-center">
					<view>更多套餐组合</view>
					<image src="/static/image/icon/arrow-right.png"></image>
				</view>
			</view> -->
			<!-- 商品分类 -->
			<view class="clalist goods-margin" @click="back">
				<view class="dir-left-nowrap item">
					<view class="box-grow-0">
						<image
							:src="catsall.pic_url != '' ? catsall.pic_url : imgprefix + '/web/uploads/thumbs/mall1/20210628/ee56ff6d2fd02c27930d11a635ace256.jpg'"
							class="avatar"></image>
					</view>
					<view class="box-grow-1">
						<view class="name mb-8">{{catsall.name}}</view>
					</view>
				</view>
				<view class="evaluate">
					<view class="main-right">
						宝贝描述<text class="red">高</text>
					</view>
					<view class="main-right eva-item">
						卖家服务<text class="red">高</text>
					</view>
					<view class="main-right eva-item">
						实体店服务<text class="red">高</text>
					</view>
				</view>
			</view>
			<!--本频道推荐-->
			<view class="app-goods-recommend goods-margin" v-if="recom_list.length > 0">
				<view class="recommend-title dir-left-nowrap main-between">
					<view class="dir-left-nowrap cross-center">
						<view class="text">本频道推荐</view>
					</view>
					<view class="more" @click="back">
						更多
					</view>
				</view>
				<view class="recommend-list">
					<u-ordinary-list goodsStyle="2" :list="recom_list" :theme="getTheme" :list-style="3">
					</u-ordinary-list>
				</view>
			</view>
			<!--商品详情-->
			<view class="goods-margin">
				<app-goods-detail :mall_id="mall_id" :goods="{detail, id: goodsId}"></app-goods-detail>
			</view>
			<!--猜你喜欢-->
			<app-goods-recommend title="猜你喜欢" :sureCart="true" :theme="getTheme" :goods-list="like_list"
				:mall_id="mall_id">
			</app-goods-recommend>
			<!-- 推荐 -->
			<!-- <app-goods-recommend title="今日推荐" :sureCart="true" :theme="getTheme" :goods-list="recommend_list">
			</app-goods-recommend> -->
			<!--空格区域-->
			<view class="safe-area-inset-bottom u-bottom">
				<view class="u-bottom-height" :class="full_reduce ? 'u-bottom-height-1' : 'u-bottom-height-0'"></view>
			</view>
			<!--底部按钮-->
			<view class="safe-area-inset-bottom u-bottom-fixed">
				<view v-if="full_reduce">
					<app-goods-full-reduce :theme="getTheme" :full_reduce="full_reduce"
						:sign="goods.type === 'goods' ? '' : 1">
					</app-goods-full-reduce>
				</view>
				<!-- 11.02 假拼团跳转位置 -->
				<!-- <view class="" style="width: 100%;border-bottom: 1rpx solid #e2e2e2;" @click="jump('/pages/goods/sharegold/sharegold')">
					<view style="width: 100%;height: 52rpx;text-align: center;line-height: 52rpx;" class="">
						邀请好友领金币
					</view>
				</view> -->
				<view class="app-bottom u-bottom-height-0 dir-left-nowrap">
					<!-- <view class="dir-top-nowrap main-center cross-center little box-grow-0" @click="back">
						<image src="../../static/image/icon/index.png"></image>
						<view>首页</view>
					</view> -->
					<view class="dir-top-nowrap main-center cross-center little box-grow-0" @click="back">
						<image
							:src="catsall.pic_url != '' ? catsall.pic_url : imgprefix + '/web/uploads/thumbs/mall1/20210628/ee56ff6d2fd02c27930d11a635ace256.jpg'">
						</image>
						<view class="u-line-1" style="width:100rpx;text-align: center;">{{catsall.name}}</view>
					</view>
					<!-- <view class="dir-top-nowrap main-center cross-center little box-grow-0" @click="custom">
						<image src="../../static/image/summary-phone.png"></image>
						<view>客服</view>
					</view> -->
					<!-- 9.14 加分享 -->
					<view class="dir-top-nowrap main-center cross-center little box-grow-0 red" @click="shareClick">
						<image src="/static/image/icon/icon-share.png"></image>
						<view>分享</view>
					</view>
					<!-- 9.15 分享 11.29 将store换为userInfo.vdian_id -->
					<view>
						<app-share-qr-code v-model="shareShow" :url="shareUrl" :has-poster-nav="true"
							:poster-config="poster_config + `&goods_id=` + goods.id + `&v_id=` + userInfo.vdian_id + `&mall_id=` + mall_id"
							:poster-generate="poster_generate + `&goods_id=` + goods.id + `&v_id=` + userInfo.vdian_id + `&mall_id=` + mall_id">
						</app-share-qr-code>
					</view>
					<view class="dir-top-nowrap main-center cross-center little box-grow-0" @click="favorite">
						<image
							:src="goods.favorite ? '../../static/image/icon/icon-favorite-active.png' : '../../static/image/icon/icon-favorite.png'">
						</image>
						<view>收藏</view>
					</view>
					<template v-if="goods.is_negotiable !== 1">
						<view class="box-grow-1 dir-left-nowrap" style="height: 100%;" v-if="goods.goods_num == 0">
							<view style="width: 100%;background-color: #CDCDCD;color: #fff;"
								class="main-center cross-center button">已售罄</view>
						</view>
						<view class="box-grow-1 dir-left-nowrap" style="height: 100%;" v-else>
							<!-- 11.12 注释 只留 购买 -->
							<view v-if="goods.type === 'goods' && mall_id == 2" class="main-center cross-center button"
								@click="clickAttr(0)"
								:class="getTheme === 'b' || getTheme === 'a' || getTheme === 'f' ? getTheme + '-s-back ' + 'text ' + getTheme : getTheme + '-s-back ' + getTheme + '-m-text ' + getTheme">
								加入购物车
							</view>
							<!-- <view v-else class="main-center cross-center button" @click="clickAttr(0)"
								:class="getTheme === 'b' || getTheme === 'a' || getTheme === 'f' ? getTheme + '-s-back ' + 'ecard-text ' + getTheme : getTheme + '-s-back ecard-text ' + getTheme">
								加入购物车
							</view>
							<app-jump-button v-if="selfStore" form arrangement="topCenter" open_type="share"
								style="width: 100%;height: 100%;">
								<view class="main-center cross-center button" style="color: #ffffff;"
									:class="getTheme + '-m-back ' + getTheme">分享挣钱
								</view>
							</app-jump-button> -->
							<!-- 11.12 v-else clickAttr(1) -->
							<view class="main-center cross-center button" style="color: #ffffff;" @click="toshareprice"
								:class="getTheme + '-m-back ' + getTheme">
								<!-- 立即购买 -->
								支付定金
							</view>
						</view>
					</template>
					<view class="box-grow-1 dir-left-nowrap btn" v-else>
						<block v-for="(item, index) in good_negotiable" :key="index">
							<template v-if="item === 'contact_tel'">
								<view class="box-grow-1 " id=82643
									:class="good_negotiable.length === 1 ? getTheme + '-m-back ' + getTheme + '-s-text ' + getTheme : getTheme + '-s-back ' + 'text ' + getTheme">
									<app-jump-button :number="mall.setting.contact_tel" open_type="tel">
										<view>联系电话</view>
									</app-jump-button>
								</view>
							</template>
							<!-- #ifndef MP-TOUTIAO -->
							<template v-else-if="item === 'contact'">
								<view class="box-grow-1 contact" :class="contactBtn">
									<app-jump-button open_type="contact">
										<view>客服</view>
									</app-jump-button>
								</view>
							</template>
							<!-- #endif -->
							<template v-else-if="item === 'contact_web'">
								<view class="box-grow-1 service"
									:class="good_negotiable.length === 3 ? 'default-bakground' : good_negotiable.length === 2 ? getTheme + '-m-back ' + getTheme + '-s-text ' + getTheme : getTheme + '-m-back ' + getTheme + '-s-text ' + getTheme">
									<app-jump-button :url="'/pages/web/web?url=' + mall.setting.web_service_url"
										open_type="web">
										<view>客服</view>
									</app-jump-button>
								</view>
							</template>
						</block>
					</view>
				</view>
			</view>
			<view class="quick-box quick-one" @click="tostore" v-if="mall_id == 1 || mall_id == 2">
				规划4500家实体店
			</view>
			<view class="quick-box dir-top-nowrap" v-else>
				<view class="" v-for="(item,index) in fixnavs" :key="index">
					<app-jump-button
						:url="item.url.indexOf('?') != -1 ? item.url + '&mall_id=' + mall_id : item.url + '?mall_id=' + mall_id">
						<view class="">
							<image :lazy-load="true" class="quick-btn" :src="item.icon_url"></image>
							<view class="quick-text">{{item.name}}</view>
						</view>
					</app-jump-button>
				</view>
			</view>
			<!--快捷导航-->
			<!-- <app-quick-navigation></app-quick-navigation> -->
		</template>
	</app-layout>
</template>

<script>
	import {
		mapGetters,
		mapState
	} from "vuex";
	import appGoodsBanner from "../../components/page-component/goods/app-goods-banner.vue";
	import appGoodsPrice from "../../components/page-component/goods/app-goods-price.vue";
	import appService from "../../components/page-component/goods/app-goods-service.vue";
	import appGoodsAttr from "../../components/page-component/goods/app-goods-attr.vue";
	import appGoodsCoupon from "../../components/page-component/goods/app-goods-coupon.vue";
	import appGoodsMarketing from "../../components/page-component/goods/app-goods-marketing.vue";
	import appGoodsDetail from "../../components/page-component/goods/app-goods-detail.vue";
	import appGoodsComment from "../../components/page-component/goods/app-goods-comment.vue";
	import appGoodsRecommend from "../../components/page-component/app-goods-recommend/app-goods-recommend.vue";
	import appQuickNavigation from "../../components/page-component/app-quick-navigation/app-quick-navigation.vue";
	import appComposition from '../../components/basic-component/app-composition/app-composition.vue';
	import AppVipCard from '../../components/page-component/app-vip-card/app-vip-card';
	import uniSwiperDot from '../../components/basic-component/uni-swiper-dot/uni-swiper-dot';
	import appGoodsFlashSale from '../../components/page-component/goods/app-goods-flash-sale.vue';
	import uAttr from '../../components/page-component/goods/u-attr.vue';
	import appGoodsFullReduce from '../../components/page-component/goods/app-goods-full-reduce.vue';
	import uOrdinaryList from '../../components/page-component/u-goods-list/u-ordinary-list.vue';
	// 9.15 分享
	import appShareQrCode from '../../components/page-component/app-share-qr-code-poster/app-share-qr-code-poster.vue';
	let mallurl = null
	export default {
		name: "goods",
		components: {
			appGoodsBanner,
			appGoodsPrice,
			appGoodsAttr,
			appGoodsMarketing,
			appGoodsComment,
			'app-goods-service': appService,
			'app-goods-detail': appGoodsDetail,
			'app-goods-recommend': appGoodsRecommend,
			'app-quick-navigation': appQuickNavigation,
			'app-composition': appComposition,
			uniSwiperDot,
			AppVipCard,
			appGoodsFlashSale,
			appGoodsFullReduce,
			appGoodsCoupon,
			uAttr,
			uOrdinaryList,
			// 9.15 分享
			appShareQrCode
		},
		data() {
			return {
				clatitle: '',
				goods: null,
				selectAttr: null,
				like_list: null,
				recommend_list: null,
				recom_list: null,
				is_vip: false,
				is_vip_card_user: 0,
				current: 0,
				discount: null,
				attrShow: false,
				shareData: null,
				contact_tel: '',
				contact: '',
				contact_web: '',
				poster_config: this.$api.goods.poster,
				poster_generate: this.$api.poster.goods_new,
				// 限时抢购
				flash_sale: null,
				checked: null,
				// 商品服务
				services: null,
				// 商品详情
				detail: null,
				// 商品ID
				goodsId: null,
				// 套餐组合
				composition: null,
				autoplay: true,
				full_reduce: null,
				goods_marketing_award: null,
				express: null,
				goods_marketing: null,
				selfStore: false,
				store_id: '',
				// 商品分类
				catsall: '',
				cat_id: '',
				catstitle: '',
				cattitle: '',
				// 门店列表
				storelist: [],
				longitude: '',
				latitude: '',
				firstGoodsId: null,
				imgprefix: this.$siteInfo.imgroot,
				kefu: '',
				comment_list: [],
				page: 1,

				// title:''
				// 9.15 分享
				shareShow: false,

				// 9.30
				isshoe: false,

				// 11.10 多名珠宝店主信息
				avaterimg: [],
				// 11.12 判断是否黄金频道 黄金频道不使用白条
				ishj: false,
				// 11.12 是否分享成功
				issharesuc: false,
				// 11.12 商品id
				gods_id: 0,

				mall_id: 1,
				// 实体店固定导航 // 固定导航数据
				fixnavs: [],

				timeout: new Date().getTime(),
			};
		},
		computed: {
			themeObject: function() {
				return {
					back: this.getTheme + '-m-back ' + this.getTheme,
					theme: this.getTheme,
					color: this.getTheme + '-m-text ' + this.getTheme,
					sBack: this.getTheme + '-s-back ' + this.getTheme
				}
			},
			...mapState({
				mall: state => state.mallConfig.mall,
				gConfig: state => state.gConfig,
				userInfo: state => state.user.info,
				storemall: state => state.malid.apimaUrl
			}),
			...mapGetters('mallConfig', {
				getTheme: 'getTheme',
			}),
			good_negotiable: function() {
				let good_negotiable = this.mall.setting.good_negotiable;
				this.contact_tel = '';
				this.contact = '';
				this.contact_web = '';
				let arr = [];
				for (let i = 0; i < good_negotiable.length; i++) {
					if (good_negotiable[i] === 'contact_tel') {
						this.contact_tel = 'contact_tel';
					}
					if (good_negotiable[i] === 'contact') {
						this.contact = 'contact';
					}
					if (good_negotiable[i] === 'contact_web') {
						this.contact_web = 'contact_web';
					}
				}
				if (this.contact_tel) {
					arr.push(this.contact_tel);
				}
				if (this.contact) {
					arr.push(this.contact);
				}
				if (this.contact_web) {
					arr.push(this.contact_web);
				}
				return arr;
			},
			contactBtn: function() {
				const len = this.good_negotiable.length;
				const theme = this.getTheme;
				if (len === 3 && (theme === 'a' || theme === 'b' || theme === 'f')) {
					return `${theme}-m-back ${theme}-s-text ${theme}`;
				} else if (len === 3 && !(theme === 'a' || theme === 'b' || theme === 'f')) {
					return `${theme}-m-back ${theme}-s-text ${theme}`;
				}
				if (len === 2 && (theme === 'a' || theme === 'b' || theme === 'f') && !this.contact_tel) {
					return `${theme}-s-back text ${theme}`;
				} else if (len === 2 && (theme === 'a' || theme === 'b' || theme === 'f') && this.contact_tel) {
					return `${theme}-m-back ${theme}-s-text ${theme}`;
				} else if (len === 2 && !(theme === 'a' || theme === 'b' || theme === 'f') && !this.contact_tel) {
					return `${theme}-s-back text ${theme}`;
				} else if (len === 2 && !(theme === 'a' || theme === 'b' || theme === 'f') && this.contact_tel) {
					return `${theme}-m-back ${theme}-s-text ${theme}`;
				} else {
					return `${theme}-m-back ${theme}-s-text ${theme}`;
				}
			}
		},
		mounted() {
			this.allReq(15)
		},
		onLoad(options) {
			// console.log(options);

			// this.kefu = this.$storage.getStorageSync('KEFU')
			this.clatitle = options.title || ''
			this.mall_id = options.mall_id || 1
			mallurl = this.$siteInfo.apiroot + '?_mall_id=' + this.mall_id + '&r='
			if (this.mall_id > 1) {
				// this.$store.dispatch('malid/actionSetMallId', this.mall_id)
				// this.poster_config = this.storemall.goods.poster
				// this.poster_generate = this.storemall.poster.goods_new
				this.poster_config = mallurl + this.$apiUrl.goods.poster
				this.poster_generate = mallurl + this.$apiUrl.poster.goods_new
			}

			let sharestoreid = this.$storage.getStorageSync('sharestoreid')
			if (sharestoreid) {
				this.store_id = sharestoreid
			}
			// 9.14 加
			let jewelstoreid = this.$storage.getStorageSync('jewelstoreid')
			if (jewelstoreid) {
				this.store_id = jewelstoreid
			}
			if (options.cat_id) {
				this.cat_id = options.cat_id
			}
			/* if (options.title) {
				this.title = options.title
			} */
			if (options.vid != undefined || options.vid != null) {
				if (options.vid != '') {
					this.$storage.setStorageSync('sharestoreid', options.vid)
					this.store_id = options.vid
				}
			}
			if (options.store_id != undefined || options.store_id != null) {
				if (options.store_id != '') {
					this.store_id = options.store_id
				}
			}

			uni.showShareMenu({
				withShareTicket: true,
				menus: ['shareAppMessage', 'shareTimeline']
			})
			this.selfStore = options.selfShop

			// #ifdef MP-WEIXIN
			wx.showShareMenu({
				menus: ['shareAppMessage', 'shareTimeline']
			})
			// #endif
			if (this.isLogin) {
				this.$store.dispatch('user/info');
			} else {}
			// this.loadComment(options.id)
			// 11.12 注释
			// this.loadData(options.id);
			if (options.id) {
				this.gods_id = options.id
			}
			// 11.10 珠宝店主信息
			this.storeupdown()
		},
		onShareAppMessage(object) {
			if (object.from === 'button' && this.shareData) {
				return this.$shareAppMessage(this.shareData);
			}
			return this.$shareAppMessage({
				title: this.goods.app_share_title ? this.goods.app_share_title : this.goods.name,
				imageUrl: this.goods.app_share_pic ? this.goods.app_share_pic : '',
				path: '/pages/goods/goods',
				params: {
					id: this.goodsId,
					vid: this.userInfo.vdian_id,
					username: this.userInfo.nickname,
					useravatar: this.userInfo.avatar,
					mall_id: this.mall_id,
					cat_id: this.cat_id,
				}
			});
			/* return {
				title: this.goods.app_share_title ? this.goods.app_share_title : this.goods.name,
				imageUrl: this.goods.app_share_pic ? this.goods.app_share_pic : '',
				path: '/pages/store/mine/mine?vid=' + this.userInfo.vdian_id + '&username=' + this.userInfo.nickname + '&useravatar=' + this.userInfo.avatar,
				params: {
					id: this.goodsId
				}
			}; */
		},
		// #ifdef MP-WEIXIN
		onShareTimeline() {
			// 分享朋友圈beta
			return this.$shareTimeline({
				title: this.goods.app_share_title ? this.goods.app_share_title : this.goods.name,
				query: {
					id: this.goodsId,
					vid: this.userInfo.vdian_id,
					username: this.userInfo.nickname,
					useravatar: this.userInfo.avatar,
					mall_id: this.mall_id,
					cat_id: this.cat_id,
				}
			});
		},
		// #endif
		methods: {
			// 实体店固定导航
			allReq(pid) {
				this.$request({
					url: this.$api.navs.list,
					data: {
						pid: pid,
						status: 1,
						limit: 50
					}
				}).then((res) => {
					if (res.code == 0) {
						this.fixnavs = res.data.list
					}
				}).catch(() => {

				})
			},
			// 11.12 分享 查找当前商品是否需要分享用分享价购买或是黄金频道
			taskshare() {
				let url = this.$api.gold.index
				if (this.mall_id > 1) {
					// url = this.storemall.gold.index
					url = mallurl + this.$apiUrl.gold.index
				}
				this.$request({
					url: url,
					data: {
						type: 5,
						querystate: 1,
						targetid: this.goodsId,
						userid: this.userInfo.options.user_id
						// test: 1
					}
				}).then((res) => {
					if (res.data.ishjcat) {
						// 11.17 是黄金商品下单时上传v_id为0
						this.store_id = 0
						this.ishj = true
					} else {
						this.ishj = false
					}
					if (res.data.isdone) {
						this.issharesuc = true
					} else {
						this.issharesuc = false
					}
				}).catch(() => {

				})
			},
			// 11.12 黄金分享价购买
			toshareprice() {
				if (this.goods.params.isshare && this.goods.params.isshare == 1) {
					this.$refs.issjo.isshoj = true
					this.clickAttr()
				} else {
					this.clickAttr()
				}
			},
			// 11.10 小店昵称和图片上下滑动不做操作
			storeupdown() {
				this.$request({
					url: this.$api.apply.list,
					data: {
						page: 1,
						limit: 5,
						review_status: 1,
						keyword: 'random'
					}
				}).then((res) => {
					this.avaterimg = res.data.list
				}).catch(err => {
					// console.log(err);
				})
			},
			jump(url) {
				uni.navigateTo({
					url: url
				})
			},
			// 商品评论
			loadComment(id) {
				let url = this.$api.goods.comments
				if (this.mall_id > 1) {
					// url = this.storemall.goods.comments
					url = mallurl + this.$apiUrl.goods.comments
				}
				this.$request({
					url: url,
					data: {
						page: this.page,
						page_size: 20,
						batch_ids: id
					}
				}).then(response => {
					this.$hideLoading();
					if (response.code === 0) {
						this.comment_list = response.data.list
					}
				}).catch(() => {
					this.$hideLoading();
				});
			},
			voucher() {
				uni.navigateTo({
					url: '/pages/video/explain/explain?id=20&title=' + '如何获取优惠券'
				})
			},
			// 查询裸钻
			searchbr() {
				uni.navigateTo({
					url: '/plugins/diamonds/baredrill'
				})
			},
			// 查询戒托
			searchjt() {
				uni.navigateTo({
					url: '/plugins/diamonds/ring'
				})
			},
			// 9.30 金币白条
			tobaitiao() {
				this.$refs.issjo.isshoe = true
				// 10.9 每次刷新金币总数
				this.$refs.issjo.allgold()
				this.clickAttr() // 测试使用 非正式
			},
			leabrand() {
				uni.navigateTo({
					url: '/pages/video/videodetail/videodetail?id=20&title=' + '线上线下完美合一的珠宝领导品牌'
				})
			},
			integral() {
				uni.navigateTo({
					url: '/pages/video/explain/explain?id=30&title=' + '获取金币规则'
				})
			},
			// 规格选择
			check(obj) {
				this.checked = obj;
			},
			/* deposit(){
				uni.navigateTo({
					url: `/pages/order-submit/order-submit?mch_list=${JSON.stringify([goods])}`
				});
			}, */
			change(e) {
				if (e.detail.source === 'touch') {
					this.current = e.detail.current;
				}
				if (e.detail.source === 'autoplay') {
					this.current = e.detail.current;
				}
			},
			quickShare(info) {
				this.shareData = info;
			},
			toComposition(item) {
				let id = item.id > 0 ? item.id : this.composition.list[0].id
				uni.navigateTo({
					url: this.composition.url + '?goods_id=' + this.goodsId + '&composition_id=' + id
				})
			},
			// 获取商品详情
			loadData(id) {
				this.$showLoading();
				let url = this.$api.goods.detail
				if (this.mall_id > 1) {
					// url = this.storemall.goods.detail
					url = mallurl + this.$apiUrl.goods.detail
				}
				this.$request({
					url: url,
					data: {
						id: id
					}
				}).then(response => {
					this.$hideLoading();
					this.loadComment(id)
					if (response.code === 0) {
						let {
							services,
							detail,
							name,
							vip_card_appoint,
							plugin_extra,
							id,
							goods_activity,
							goods_marketing_award,
							goods_marketing,
							express,
							cats,
							catsall,
							catsallinfo
						} = response.data.goods;
						uni.setNavigationBarTitle({
							title: name
						});
						// 如果mall_id没有传过来
						if (isNaN(Number(this.mall_id))) {
							this.mall_id = this.goods.mall_id
							if (this.mall_id > 1) {
								mallurl = this.$siteInfo.apiroot + '?_mall_id=' + this.mall_id + '&r='
							}
						}
						if (cats.indexOf('1315') != -1) {
							this.catstitle = 'diamonds'
						}

						// 9.15 分享
						this.shareUrl = this.$api.poster.goods + '&goods_id=' + id + '&v_id=' + this.store_id;
						if (this.mall_id > 1) {
							// this.shareUrl = this.storemall.poster.goods + '&goods_id=' + id + '&v_id=' + this.store_id;
							this.shareUrl = mallurl + this.$apiUrl.poster.goods + '&goods_id=' + id + '&v_id=' +
								this.store_id;
						}

						this.goods = response.data.goods;


						if (this.cat_id != '' && this.cat_id == 0) {
							let cnp = {
								name: this.clatitle,
								pic_url: this.imgprefix +
									'/web/uploads/thumbs/mall1/20210628/ee56ff6d2fd02c27930d11a635ace256.jpg'
							}
							// console.log(cnp);
							this.catsall = cnp
						} else if (this.cat_id != '' && this.cat_id != 0) {
							let catoinfo = []
							catoinfo = catsallinfo.filter(item => {
								return item.id == this.cat_id
							})
							let catinfo = catoinfo[0]
							this.catsall = catinfo
							this.kefu = catinfo.advert_url
						} else {
							this.catsall = catsall
							this.kefu = catsall.advert_url
						}


						this.services = services;
						this.detail = detail;
						this.goodsId = id;
						this.flash_sale = plugin_extra.flash_sale;
						this.composition = plugin_extra.composition;
						this.goods_marketing_award = goods_marketing_award;
						this.goods_marketing = goods_marketing;
						this.express = express;
						if (goods_activity) {
							this.full_reduce = goods_activity.full_reduce;
						}
						if (vip_card_appoint.discount || vip_card_appoint.discount == '0.00') {
							this.is_vip = true;
							this.discount = vip_card_appoint.discount
						}
						this.is_vip_card_user = vip_card_appoint.is_vip_card_user;
						// 11.12 是否黄金是否分享
						this.taskshare()
						this.loadLike();
						// this.loadRecommend()
						this.loadRecom()
					} else {
						uni.showToast({
							title: response.msg,
							icon: 'none'
						});
					}
				}).catch(() => {
					this.$hideLoading();
				});
			},
			onAttr(data) {
				this.selectAttr = data;
			},
			/* loadRecommend() {
				this.$request({
					url: this.$api.goods.new_recommend,
					data: {
						goods_id: this.goodsId,
						type: 'goods'
					}
				}).then(response => {
					if (response.code === 0) {
						this.recommend_list = response.data.list;
					}
				});
			}, */
			// 本频道推荐
			loadRecom() {
				let url = this.$api.goods.randow
				if (this.mall_id > 1) {
					// url = this.storemall.goods.randow
					url = mallurl + this.$apiUrl.goods.randow
				}
				this.$request({
					url: url,
					data: {
						cat_id: this.catsall.id,
						page: 6,
						mch_id: 0,
						sort: 1
					}
				}).then(response => {
					if (response.code === 0) {
						this.recom_list = response.data.list;
					}
				});
			},
			// 猜你喜欢
			loadLike() {
				let redata = {
					url: this.$api.goods.randow,
					data: {
						cat_id: 184,
						page: 8,
						mch_id: 0,
						sort: 1
					}
				}
				if (this.mall_id == 1) {
					redata = {
						url: this.$api.goods.randow,
						data: {
							cat_id: 184,
							page: 8,
							mch_id: 0,
							sort: 1
						}
					}
				} else {
					redata = {
						url: mallurl + this.$apiUrl.goods.randow,
						// url: this.storemall.goods.randow,
						data: {
							cat_id: 0,
							page: 8,
							mch_id: 0,
							sort: 1
						}
					}
				}
				this.$request(redata).then(response => {
					if (response.code === 0) {
						this.like_list = response.data.list;
					}
				});
			},
			// 今日推荐
			/* loadRecommend() {
				
				this.$request({
					url: this.$api.goods.randow,
					data: {
						cat_id: this.catsall.id,
						page: 8,
						mch_id: 0,
						sort: 1
					}
				}).then(response => {
					if (response.code === 0) {
						this.recommend_list = response.data.list;
					}
				});
			}, */
			back() {
				/* uni.reLaunch({
					url: '/pages/index/index'
				}); */
				/* uni.navigateBack({
					delta: 1
				}) */
				let url = '/pages/goods/catslist?cat_id=' + this.catsall.id + '&title=' + this.catsall.name +
					'&mall_id=' + this.mall_id
				if (this.mall_id == 2) {
					url = '/plugins/diamonds/index?cat_id=' + this.catsall.id + '&title=' + this.catsall.name +
						'&mall_id=' + this.mall_id
				}
				if (this.ishj) {
					url = url + '&godstype=huangjin'
				}
				uni.navigateTo({
					url: url
				})
			},
			favorite() {
				let url = this.$api.user.favorite_add;
				if (this.mall_id > 1) {
					// url = this.storemall.user.favorite_add
					url = mallurl + this.$apiUrl.user.favorite_add
				}
				let favorite = true;
				if (this.goods.favorite) {
					url = this.$api.user.favorite_remove;
					if (this.mall_id > 1) {
						// url = this.storemall.user.favorite_remove
						url = mallurl + this.$apiUrl.user.favorite_remove
					}
					favorite = false;
				}
				this.goods.favorite = favorite;
				this.$request({
					url: url,
					data: {
						goods_id: this.goodsId
					}
				}).then(response => {
					if (response.code === 0) {} else {
						uni.showModal({
							title: '提示',
							content: response.msg,
							showCancel: false
						});
					}
				});
			},
			custom() {
				// 9.8注释
				/* if (this.kefu != '') {
					uni.navigateTo({
						url: '/pages/web/web?url=' + encodeURIComponent(this.kefu)
					})
				} else {
					uni.navigateTo({
						url: '/pages/web/web?url=' + this.mall.setting.web_service_url
					})
				} */
				// 9.8 修改客服
				if (wx.openCustomerServiceChat) {
					wx.openCustomerServiceChat({
						extInfo: {
							url: 'https://work.weixin.qq.com/kfid/kfc2132bcfa45f0fb28'
						},
						corpId: 'ww4e635c5ebdf96587',
						showMessageCard: true
					})
				} else {
					uni.showModal({
						title: '版本不支持',
						content: '请下载最新版本微信',
						showCancel: false,
						confirmText: '我知道了'
					})
				}
				/* if (this.kefu != '') {
					uni.navigateTo({
						url: '/pages/web/web?url=' + this.kefu
					})
				} else {
					uni.navigateTo({
						url: '/pages/web/web?url=' + this.mall.setting.web_service_url
					})
				} */
			},
			// 9.15 分享
			shareClick() {
				// 判断登入
				if (!this.$user.isLogin()) {
					this.$user.getInfo().then(() => {});
				} else {
					if (this.goods.extra_quick_share) {
						this.quickShareShow = true;
					} else {
						this.shareShow = true;
					}
				}
			},
			clickAttr(data) {
				if (this.goods.type === 'ecard' && data === 0) {
					uni.showToast({
						title: '虚拟商品不允许加入购物车',
						icon: 'none'
					});
					return;
				}
				this.attrShow = true;
			},
			setCoupon(index) {
				this.$set(this.goods.goods_coupon_center[index], 'is_receive', 1);
			},
			tostore() {
				/* uni.navigateTo({
					url: '/pages/order-submit/store-pick?isshow=true'
				}) */
				uni.navigateTo({
					url: '/pages/turnover/videolist?type=20&title=实体店'
				})
			}
		},
		onShow() {
			// 每次进入刷新详情页面
			this.loadData(this.gods_id);
			this.autoplay = true;
			// 10.9 每次刷新金币
			// if(this.$refs.issjo.isshoe){
			// 	this.$refs.issjo.allgold()
			// }
		},
		onHidden() {
			this.autoplay = false;
		}
	}
</script>

<style scoped lang="scss">
	// 水印
	.rotalogo {
		position: absolute;
		top: 12rpx;
		left: 12rpx;
		// top: 0;
		// left: 0;
		width: 240rpx;
		z-index: 99;

		.image {
			width: 240rpx;
		}
	}

	// 11.10 珠宝店主 上下切换
	.rota {
		position: absolute;
		// top: 12rpx;
		// left: 12rpx;
		top: 680rpx;
		left: 12rpx;
		width: 240rpx;
		height: 50rpx;
		z-index: 99;
		background: rgba(255, 255, 255, 0.5);
		font-size: 24rpx;
		line-height: 50rpx;
		text-align: center;
		border-radius: 50rpx;
		box-shadow: 0 1rpx 3rpx rgba(0, 0, 0, 0.2);

		.imgag {
			width: 48rpx;
			height: 48rpx;
			border-radius: 50rpx;
			margin: 0 12rpx;
		}
	}

	// 11.10 介绍视频弹窗
	.movable {
		position: fixed;
		top: 0;
		left: 0;
		pointer-events: none;
		z-index: 1001;
		width: 750rpx;
		height: 100%;

		.movable-item {
			background: rgba(255, 255, 255, 0.5);
			border-radius: 4rpx;
			box-shadow: 0 1rpx 3rpx rgba(0, 0, 0, 0.2);
			pointer-events: auto;
			width: 100rpx;
			height: 100rpx;
			font-size: 24rpx;
			line-height: 100rpx;
			text-align: center;
		}
	}

	.goods-composition {
		padding: 24rpx;
		background-color: #fff;

		.goods-composition-title {
			font-size: 28rpx;
			color: #353535;
			margin-bottom: 20rpx;
		}

		.goods-composition-swiper {
			height: 194rpx;
		}

		.goods-composition-more {
			margin: 20rpx auto 4rpx auto;
			width: 226rpx;
			padding: 0 24rpx;
			height: 56rpx;
			line-height: 54rpx;
			border-radius: 28rpx;
			border: 2rpx solid #bbbbbb;
			font-size: 24rpx;
			color: #999999;

			image {
				width: #{12rpx};
				height: #{22rpx};
				display: block;
			}
		}
	}

	.goods-explain {
		width: 100%;
		height: 60rpx;
		line-height: 60rpx;
		// background-color: #ff4544;
		color: #FFFFFF;
		font-size: 28rpx;
		font-weight: 600;
		padding: 0 24rpx;
		text-align-last: justify;
	}

	.goods-name {
		padding: 24upx 24upx 0 24upx;
		background-color: #ffffff;
		color: #353535;
		font-size: 32upx;
		line-height: 42upx;
	}

	.goodcatname {
		font-size: 24rpx;
		color: #FFFFFF;
		background-color: #fe0000;
		padding: 6rpx 24rpx;
		border-radius: 24rpx;
		margin-right: 6rpx;
	}

	.goods-subtitle {
		padding: #{24rpx 24rpx 0 24rpx};
		font-size: 24rpx;
		background-color: #ffffff;
		color: #999999;
	}

	.price {
		// padding-top: #{24rpx};
		background-color: #ffffff;
	}

	.vip-card {
		padding-bottom: #{20rpx};
		background-color: #fff;
	}

	.attr {
		background-color: #f7f7f7;
	}

	.bottom {
		width: 100%;
		height: #{110rpx};
	}

	.app-bottom {
		width: 100%;
		font-size: $uni-font-size-general-one;
		background-color: #ffffff;

		.little {
			width: #{110rpx};
			height: 100%;
			background-color: #ffffff;
			font-size: #{20rpx};
			color: $uni-general-color-two;
			border-right: #{1rpx} solid #e2e2e2;

			// 9.15
			&.red {
				color: $uni-important-color-red;
			}

			&:first-child {
				border-right: #{1rpx} solid #e2e2e2;
			}

			&:last-child {
				border-right: none;
			}

			image {
				width: #{40rpx};
				height: #{40rpx};
				display: block;
				margin-bottom: #{10rpx};
			}
		}

		.btn {
			height: 100%;
		}

		.button {
			// width: 50%;
			width: 100%;
			height: 100%;
		}

		.service {
			color: #ffffff;
		}
	}

	.text {
		color: #ffffff;
	}

	.default-bakground {
		background-color: #446dfd;
	}

	.u-bottom-fixed {
		border-top: 1rpx solid #e2e2e2;
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		z-index: 1500;
		background-color: #ffffff;
	}

	.u-bottom-height-0 {
		height: 110upx;
	}

	.u-bottom-height-1 {
		height: 190upx;
	}

	.goods-margin {
		margin-top: 20upx;
	}

	.zsjt {
		width: 100%;
		margin: 0 auto;
	}

	// 本频道推荐
	.app-goods-recommend {
		margin-top: 20upx;
		background-color: #FFFFFF;

		.recommend-title {
			padding: 40rpx 24rpx 32rpx;
			font-size: 32rpx;

			.text {
				color: #333;
			}

			.more {
				font-size: 28rpx;
				color: #666666;
			}
		}
	}

	// 门店列表
	.list {
		.item {
			padding: #{24rpx};
			background: #fff;
			border-bottom: #{1rpx} solid $uni-weak-color-one;

			.avatar {
				width: #{140rpx};
				height: #{140rpx};
				margin-right: #{24rpx};
				border-radius: #{999rpx};
				box-shadow: 0 0 #{1rpx} rgba(0, 0, 0, .25);
			}

			.name {
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}

			.mobile,
			.distance {
				font-size: $uni-font-size-general-one;
				color: $uni-general-color-two;
			}
		}
	}

	// 本频道
	.clalist {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: #{24rpx};
		background: #FFFFFF;

		.item {
			padding: #{24rpx};
			display: flex;
			align-items: center;

			.avatar {
				width: 100rpx;
				height: 100rpx;
				margin-right: #{24rpx};
				border-radius: #{999rpx};
				box-shadow: 0 0 #{1rpx} rgba(0, 0, 0, .25);
			}

			.name {
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}
		}

		.evaluate {
			font-size: 24rpx;

			.eva-item {
				margin: 12rpx 0 0;
			}

			.red {
				margin-left: 12rpx;
				color: #EB5757;
			}
		}
	}

	// 如何获取抵用券
	.u-service {
		height: 100upx;
		background-color: #fff;
		font-size: 26upx;
		padding: 0 24upx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	// 10.8
	.u-orange {
		color: #fd5a26;
		font-size: 32rpx;
		font-weight: bold;

		.canmore {
			border-radius: 60rpx;
			background: #ff0016;
			font-size: 24rpx;
			line-height: 44rpx;
			padding: 0 24rpx;
			color: #FFFFFF;
			display: flex;

			.bigzi {
				font-size: 36rpx;
				font-weight: bold;
				line-height: 60rpx;
			}

			.smalzi {
				line-height: 72rpx;
			}
		}
	}

	.u-red {
		color: #fe0000;
		font-size: 32rpx;
		font-weight: bold;

		.canmore {
			width: 175rpx;
			height: 44rpx;
			border-radius: 60rpx;
			background: #ed9196;
			font-size: 24rpx;
			line-height: 44rpx;
			padding: 0 24rpx;
			color: #332d24;
			display: inline-flex;
			align-items: center;
			justify-content: space-around;
		}

		.image {
			width: 12upx;
			height: 22upx;
		}

	}

	.u-text {
		color: #999999;
	}

	.u-icon-del {
		width: 12upx;
		height: 22upx;
		display: block;
	}

	.ecard-text {
		color: #999999;
	}

	// 实体店
	.quick-box {
		/* position: fixed;
		right: 48rpx;
		z-index: 100;
		bottom: 90px;
		width: 80rpx;
		height: 80rpx;
		overflow: hidden;
		border-radius: 50%;
		background: #FFFFFF;
		font-size: 24rpx;
		line-height: 80rpx;
		text-align: center;
		border: 1rpx solid #ccc; */
		/* position: fixed;
		right: 48rpx;
		bottom: 180rpx;
		z-index: 100;
		width: 100rpx;
		height: 150rpx;
		overflow: hidden;
		border-radius: 10rpx;
		background: #FFFFFF;
		font-size: 24rpx;
		line-height: 50rpx;
		text-align: center;
		border: 1rpx solid #ccc;
		color: #ff2f2f; */
		position: fixed;
		bottom: 180rpx;
		right: 48rpx;
		width: 100rpx;
		z-index: 100;
		transition: opacity 0.4s;
		text-align: center;
		overflow: hidden;
		font-size: 24rpx;
		text-align: center;
	}

	.quick-one {
		height: 150rpx;
		line-height: 50rpx;
		border-radius: 10rpx;
		border: 1rpx solid #ccc;
		background: #FFFFFF;
		color: #ff2f2f;
	}

	.quick-btn {
		width: 70rpx;
		height: 70rpx;
		margin-top: 12rpx;
	}

	.quick-text {
		line-height: 24rpx;
		background: #e9e9e9;
		border-radius: 72rpx;
		padding: 4rpx 6rpx;
		font-weight: bold;
	}
</style>
